<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>客户看房日程</title>
    <link rel="stylesheet" href="../../static/css/zlh_main.css">
    <link rel="stylesheet" href="../../static/css/zlh_bootstrap.min.css">
    <!-- Bootstrap -->
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>

</head>
<body>

<!--<nav th:replace="~{/templates/topbar::top}"></nav>-->
<!--<nav th:replace="~{commonbar::middle}"></nav>-->
<nav class="navbar navbar-inverse navbar-static-top" style="margin-bottom: unset" th:fragment="top">
    <div class="container">
        <div class="navbar-header">
            <button class="navbar-toggle" data-toggle="collapse" data-target="#res-nav">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href=" " class="navbar-brand"><strong>YiJu.cn</strong></a>
        </div>
        <div class="collapse navbar-collapse" id="res-nav">
            <ul class="nav navbar-nav">
                <li><a href="#">首页</a></li>
                <li><a href="#" th:href="@{/house_list}">二手房</a></li>
                <li><a href="#" th:href="@{/estate_list}">楼盘</a></li>
                <li><a href="#" th:href="@{/agent_list}">经纪人</a></li>
                <li><a href="#">新闻</a></li>
                <li><a href="#" onclick="checkAgent()">发布房源</a></li>
                <script th:inline="javascript" >
                    function checkAgent() {
                        var agentName = '[[${agentName}]]';
                        if(agentName === 'null')
                            alert("权限不够，无法操作");
                        else window.location.href='/add_house_before';
                    }
                </script>
            </ul>
            <div class="navbar-right">
                <P class="navbar-text">您好,<a href="#" class="navbar-link">郑海松</a></P>
            </div>
        </div>
    </div>
</nav>
<div class="jumbotron" style="background-image: url(images/back01.jpg);" th:fragment="middle">
    <div class="container">
        <div class="row">
            <h3 class="col-md-6" >Welcome,<span>XXX</span>!</h3>
            <ul>
                <li style="padding-right: 60px; list-style: none; display: inline-block"><h3><a href="#" style="color: black; text-decoration: none">已发布的房源</a></h3></li>
                <li style="padding-right: 60px; list-style: none; display: inline-block"><h3><a href="#" style="color: black; text-decoration: none">客户看房行程</a></h3></li>
                <li style=" list-style: none; display: inline-block"><h3><a href="#" style="color: black; text-decoration: none">编辑个人信息</a></h3></li>
            </ul>
        </div>
    </div>
</div>




<div class="container">
    <div class="row" style="padding-top: 20px">
        <div class="col-md-8">
            <h3>
                <span style="color: black; font-weight: bold; text-decoration: none; padding-right: 20px">带看房源：</span>
                <a style="color: black; font-weight: bold; text-decoration: none;" href="#4" >东山国际新城H区在售98万装修房</a>
            </h3>
            <h3 style="color: #db4c3f; font-weight: bold;  text-decoration: none;"><span style="padding-right: 30px">预约时间：</span><span>2018/08/08</span></h3>
            <h3 style="color: black; font-weight: bold;  text-decoration: none;"><span style="padding-right: 30px;">客户备注：</span><span>中午没空。。</span></h3>
        </div>
        <div class="col-md-4" style="padding-top: 10px">
            <h4 style="color: black; font-weight: bold;  text-decoration: none;"><span style="padding-right: 30px">客户名称：</span><span>zhengqihan</span></h4>
            <h4 style="color: black; font-weight: bold;  text-decoration: none;"><span style="padding-right: 30px">联系方式：</span><span>13602801234</span></h4>
        </div>
        <hr style="background-color: aliceblue; height: 2px; width: 1130px; margin: unset; border: unset">
    </div>
</div>

<!-- 分页条 -->
<div class="container">
    <div class="row">
        <nav style="text-align: right" aria-label="Page navigation">
            <ul class="pagination">
                <li th:unless="${pageDTO.page.hasPrevious()}">
                    <a href="#" aria-label="Previous">
                        <span aria-hidden="true" th:text="首页"></span>
                    </a>
                </li>
                <li th:if="${pageDTO.page.hasPrevious()}">
                    <a aria-label="Previous" onclick="firstPage()">
                        <span aria-hidden="true" th:text="首页"></span>
                    </a>
                </li>

                <li th:unless="${pageDTO.page.hasPrevious()}">
                    <a href="#" aria-label="Previous">
                        <span aria-hidden="true">&laquo;</span>
                    </a>
                </li>
                <li th:if="${pageDTO.page.hasPrevious()}">
                    <a aria-label="Previous" onclick="prePage()">
                        <span aria-hidden="true">&laquo;</span>
                    </a>
                </li>
                <li ><a style="color: black" th:text="' 第 '+${pageDTO.page.getCurrent()}+' 页/共 '+${pageDTO.page.getPages()}+' 页 '"/></li>

                <li th:unless="${pageDTO.page.hasNext()}">
                    <a href="#" aria-label="Next">
                        <span aria-hidden="true">&raquo;</span>
                    </a>
                </li>

                <li th:if="${pageDTO.page.hasNext()}">
                    <a aria-label="Next" onclick="nextPage()">
                        <span aria-hidden="true">&raquo;</span>
                    </a>
                </li>

                <li th:unless="${pageDTO.page.hasNext()}">
                    <a href="#">
                        <span aria-hidden="true" th:text="末页"></span>
                    </a>
                </li>

                <li th:if="${pageDTO.page.hasNext()}">
                    <a aria-label="Next" onclick="lastPage()">
                        <span aria-hidden="true" th:text="末页"></span>
                    </a>
                </li>

                <script th:inline="javascript" >
                    function nextPage() {
                        var form = document.getElementById("select_form");
                        document.getElementById("select_form").action='/house_list?page=' + '[[${pageDTO.page.getCurrent()+1}]]';
                        form.submit();
                    }
                    function prePage() {
                        var form = document.getElementById("select_form");
                        document.getElementById("select_form").action='/house_list?page=' + '[[${pageDTO.page.getCurrent()-1}]]';
                        form.submit();
                    }
                    function firstPage() {
                        var form = document.getElementById("select_form");
                        form.action='/house_list';
                        form.submit();
                    }
                    function lastPage() {
                        var  form = document.getElementById("select_form");
                        form.action='house_list?page='+'[[${pageDTO.page.getPages()}]]';
                        form.submit();
                    }

                </script>
            </ul>
        </nav>
    </div>
</div>

</body>
</html>